﻿<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/Samples/Sample.Master"
    CodeBehind="Trigger.aspx.cs" Inherits="JQueryControlToolkit.Sample.Web.Samples.Trigger" %>

<asp:Content ID="Content2" ContentPlaceHolderID="body" runat="server">
    <div id="div1" style="background-color: red">
        &nbsp;</div>
    <div id="div2" style="background-color: green">
        &nbsp;</div>
    <jQuery:Trigger runat="server" TargetControlSelector="#div1" TriggerEvent="Click" WaitForPageReady="true">
        <Callback>
            <jQuery:FadeIn ID="Animation5" runat="server" TargetControlSelector="#div2" />
            <jQuery:Animation ID="Animation1" runat="server" TargetControlSelector="#div1" Style="background-color: Blue">
                <Chaining>
                    <jQuery:Animation ID="Animation2" runat="server" TargetControlSelector="#div2" Style="background-color: Blue">
                        <Chaining>
                            <jQuery:Animation ID="Animation3" runat="server" TargetControlSelector="#div2" Style="background-color: Green;" />
                            <jQuery:Animation ID="Animation4" runat="server" TargetControlSelector="#div1" Duration="1500"
                                Style="background-color: Red">
                                <Chaining>
                                    <jQuery:FadeOut ID="FadeOut1" runat="server" TargetControlSelector="#div2" Speed="1000" />
                                </Chaining>
                            </jQuery:Animation>
                        </Chaining>
                    </jQuery:Animation>
                </Chaining>
            </jQuery:Animation>
        </Callback>
    </jQuery:Trigger>
</asp:Content>
